import { InboxOutlined } from "@ant-design/icons";
import { message, Upload } from "antd";
const { Dragger } = Upload;

function DeployProcess() {


    const props = {
        name: 'file',
        multiple: true,
        action: '/api/camundaManager/deployProcDef',
        onChange(info) {
          const { status } = info.file;
          if (status !== 'uploading') {
            console.log(info.file, info.fileList);
          }
          if (status === 'done') {
            message.success(`${info.file.name} file uploaded successfully.`);
          } else if (status === 'error') {
            message.error(`${info.file.name} file upload failed.`);
          }
        },
        onDrop(e) {
          console.log('Dropped files', e.dataTransfer.files);
        },
      };


  return (
    <div>
      <Dragger {...props}>
        <p className="ant-upload-drag-icon">
          <InboxOutlined />
        </p>
        <p className="ant-upload-text">
          drag bpmn file to this area to deploy process
        </p>
        <p className="ant-upload-hint">
          when drag bpmn file to this area , the process defination will be deployed immediately 
        </p>
      </Dragger>
    </div>
  );
}

export default DeployProcess;
